<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'MyJsp.jsp' starting page</title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<link rel="stylesheet" type="text/css" href="<%=basePath%>css/bootstrap.min.css">


	<style type="text/css">
	#content { margin-top: 20px; }
	#content .col-md-2 { text-align: center;}
	#content .row{margin:0px;margin-right:-10px;}
	#content img{width: 100%;}
		#div{
		padding-top: 200px;
		}
		#div1{
			
			height: 150px;
		}
		#div2{
			width:800px;
			background-color:red;
			font-size:20px;
			margin:0 auto;
			padding-top:40px;
		}
		#div3{
			width:800px;
			background-color:blue;
			margin:0 auto;
			padding-top:40px;
		}
		#showTb1{
			margin:0 auto;
			padding-top:50px;
			width:700px;
		}
		#buttomDiv{
			width:600px;
			margin:0 auto;
			margin-top:40px;
		}
		#tr3{
			padding-top:50px;
		}
		#td1{
			width:120px;
		}
		#td2{
			width:220px;
		}
		#td3{
			width:120px;
		}
		.protImg img{
  			 transform:scale(1);
  			-ms-transform:scale(1);
  			-webkit-transform:scale(1);
  			-o-transform:scale(1);
  			-moz-transform:scale(1);
  			
		}
		
		.protImg {
			width:98px;
			height:60px;
			overflow:hidden;
		}
		.portpic{
			margin-right:-15px;
		}
		#upDiv{
			margin-left:140px;
			margin-top:50px;
		}
		body{
			font-family:"微软雅黑","黑体","宋体";
		}
	</style>
  </head>
  <body >
   	<div id="div1">

   		<div id="upDiv">
   		<input type="hidden" name="ladyID" id="ladyID"/>
   			<table id="showTb1">
   				<tr style="height:30px;" id="tr1">
   					<td id="td1">用户名：</td>
   					<td id="username"></td>
   					<td id="td3">真实姓名：</td>
   					<td id="ladyName"></td>
   				</tr>
   				<tr style="height:30px;" id="tr2">
   					<td>电话号码：</td>
   					<td id="ladyTel"></td>
   					<td>身份证号：</td>
   					<td id="ladyCard"></td>
   				</tr>
   				<tr style="height:30px;" id="tr3">
   					<td>家庭地址：</td>
   					<td id="address"></td>
   					<td>职位描述：</td>
   					<td id="des"></td>
   				</tr>
   			</table>
   		</div>
   		
   		<div id="buttomDiv">
   			<table class="table table-bordered">
   			<thead>
   				<tr>
   					<th>车位所在小区地址</th>
   					<th>车位编号</th>
   					<th>产权证编号</th>
   					<th>影印件</th>
   					<th>操作</th>
   				</tr>
   			</thead>
   				<tbody id="content">
   					
   				</tbody>
   				
   					
   			</table>
   		<div id="credit"></div>
   		</div>
   	</div>
   	<div id="div">
   		<ul class="pager">
			<li><input type="hidden" id="ladyID"></li>
			<li><input type="hidden" id="carPortID" value="0"></li>
			<li><input type="hidden" id="pageSize" value="3"></li>
			<li><a href="javascript:void(0)" id="firstPage">首页</a></li>
			<li><a href="javascript:void(0)" id="pageUp">前一页</a></li>
			<li><label id="currentPage"></label><label>/</label><label
				id="pageCount"></label></li>
			<li><a href="javascript:void(0)" id="pageDown">下一页</a></li>
			<li><a href="javascript:void(0)" id="lastPage">末页</a></li>
		</ul>
   	</div>
  </body>
  <script type="text/javascript" src="../cbdproject/js/jquery-3.1.0.min.js" charset="UTF-8"></script>
  
   

  
  <script type="text/javascript">
 
  $(function(){
		$("#content").on("click","img",function(){
			$(this).fadeIn(200);
		})
		var id =getParam("landladyID");
		$("#ladyID").val(id);
		getData(id,1);
	
  function getParam(url){
		 var reg
		 = new RegExp("(^|&)"+
		 url +"=([^&]*)(&|$)");
		 var r
		 = window.location.search.substr(1).match(reg);
		if (r!=null) return unescape(r[2]); return null;
	 }
  }	)
  
  	function getData(id,curPage){
			$.ajax({
				url:"findUnableProtByLadyID.do",
				type:"post",
				data:{"landyID":id,"curPage":curPage},
				success:function(msg){
					//console.info(msg.list[0].landlady.user.userName);
					$("#username").text(msg.list[0].landlady.user.userName);
					$("#ladyName").text(msg.list[0].landlady.ladyName);
					$("#ladyTel").text(msg.list[0].landlady.ladyTel);
					$("#ladyCard").text(msg.list[0].landlady.ladyCard);
					$("#address").text(msg.list[0].landlady.ladyAddress);
					$("#des").text(msg.list[0].landlady.ladyDescribe);
					var content="";
					$.each(msg.list,function(i,n){
						if(n.type==0){
							content+="<tr><td>"+n.carportAddress+"</td><td>"+n.carNO+"</td><td>"+n.carportNO+"</td><td  style='padding:0px;'>"+
							"<div id ='images' class='protImg'><a class='portpic'  href='javascript:;'><img style='width:50px;'"+
							"src='"+n.carportPic+"' /></a></div></td>"+
							"<td><a type='button' class='btn btn-success'  href='javascript:void(0)'  onclick='accept("+n.carportID+")'>通过</a>"+
							"<a type='button' class='btn btn-danger' href='javascript:void(0)' onclick='refuse(this)' >拒绝</a></td></tr>"
						}
					})
					$("#currentPage").html(msg.curPage);
					$("#pageCount").html(msg.countPage);
		
					$("#content").append(content);
				}
			})
	  
		}
	//分页的四个按钮功能  方法
	$(".pager a").click	(function(){
	var curPage=$("#currentPage").html();
	var countPage=$("#pageCount").html();
	var pageFtn=$(this).html();
	
	if(pageFtn=="首页"){
		curPage=1;
	}
	if(pageFtn=="前一页"){
		
		curPage=parseInt(curPage)-1;
		if(curPage<1){
			curPage=1;
		}
	}
	if(pageFtn=="下一页"){
		
		curPage=parseInt(curPage)+1;
		if(curPage>countPage){
			curPage=countPage;
		}
	}
	if(pageFtn=="末页"){
		
		curPage=countPage;
	}
	$("#content tr").remove();
	$("#currentPage").html(curPage);
	
	var id = $("#ladyID").val();
	getData(id,curPage);
		
});	
  function accept(portID){
	  $.ajax({
		  url:"accept.do",
		  type:"post",
		  data:{id:portID},
		  success:function(msg){
			  if(msg=="success"){
				  alert("审核成功");
				  $("#content").empty();
				 getData($("#ladyID").val(),1);
			  }else{
				  alert("审核失败");
			  }
		  }
	  })
  }
  function refuse(t){
	  $(t).parent().parent().remove();
	/*   getData($("#ladyID").val(),1); */
  }
  </script>
   <style>
   	.mask{
   			width:100%;
   			height:100%;
   			position:fixed;
   			top:0;
   			left:0;
   			background:rgba(0,0,0,.5);
   			text-align:center;
   			z-index:99;
   			transition:all .8s;
   			-webkit-transition:all .8s;
   		}
   		.mask .imgDiv{
   				margin-top:40px;
   			}
   </style>

   
   <script type="text/javascript">
	$(function(){
		$(document).on("click","#images a img",function(){
			var src = $(this).attr("src");
			var html = "<div class='mask'><div class='imgDiv'><img style='width:300px;' src='"+ src +"'></div></div>";
			$("body").append(html);
		});
		$(document).on("click",".mask",function(){
			$(this).remove();
		})
	
	})
   </script>
</html>
